﻿@page "/markdown"
@inject HttpClient Http
<NavBar>
    <div class="navbar-form navbar-left">
        <div class="form-group">
            <input id="filename" bind="@FileUrl" type="text" class="form-control" placeholder="http://example.com/myfile.md" />
        </div>
        <button onclick="@OnClicked" class="btn btn-primary">Import from URL</button>
    </div>
    <div class="navbar-form navbar-right">
        <DownloadButton Payload="@ContentValue" FileName="BlazeDown.md">Download as MD</DownloadButton>
    </div>
</NavBar>
<div class="container-fluid">
    <div class="row">
        <div class="alert alert-warning" role="alert">
            <p>Navigate away from the editor (left) to update the preview (right)</p>
        </div>
        <div class="row">
            <div class="col-sm-6">
                <span class="label label-default label-hint">Editor</span>
                <div class="markdown-editor">
                    <textarea bind="@ContentValue" />
                </div>
            </div>
            <div class="col-sm-6">
                <span class="label label-default label-hint">HTML Preview</span>
                <div class="markdown-view">
                    <Markdown Content="@ContentValue"></Markdown>
                </div>
            </div>
        </div>
    </div>
</div>
@functions {

    public string FileUrl { get; set; }
    public string ContentValue { get; set; }

    protected async override Task OnInitAsync()
    {
        ContentValue = await GetContentFromUrl("/sample-data/example.md");
        StateHasChanged();
    }

    private async void OnClicked(UIMouseEventArgs e)
    {
        ContentValue = await GetContentFromUrl(FileUrl);
        StateHasChanged();
    }

    private async Task<string> GetContentFromUrl(string path)
    {
        HttpResponseMessage httpResponse = await Http.GetAsync(path);
        return httpResponse.IsSuccessStatusCode ?
        await httpResponse.Content.ReadAsStringAsync() : httpResponse.ReasonPhrase;
    }

}